<template lang="html">
  <el-menu :unique-opened="true" :default-active="default_active" :router="true" class="everisk_menu_theme">
    <template v-for="(link, index) in LINKS">
      <template v-if="link.child">
        <el-submenu :index="link.lnk">
          <template slot="title">
            {{link.text}}
            <!-- <a :href="'#' + link.lnk">{{link.text}}</a> -->
          </template>
          <template v-for="item in link.child">
            <el-menu-item :index="item.lnk">
              <a :href="'#' + item.lnk">{{item.text}}</a>
            </el-menu-item>
          </template>
        </el-submenu>
      </template>
      <template v-else>
        <el-menu-item :index="link.lnk">
          <a :href="'#' + link.lnk">{{link.text}}</a>
        </el-menu-item>
      </template>
    </template>
  </el-menu>
</template>

<script>
export default {
  data () {
    return {
      LINKS: [
        {
          lnk: '/tradingcenter',
          text: '交易数据',
          child: [
            {
              lnk: '/tradingcenter/rechargerecord',
              text: '充值记录'
            }, {
              lnk: '/tradingcenter/presentrecord',
              text: '提现记录'
            }, {
              lnk: '/tradingcenter/platformservicecharge',
              text: '平台服务费'
            }, {
              lnk: '/tradingcenter/invoicetax',
              text: '发票税额'
            }, {
              lnk: '/tradingcenter/insurancecost',
              text: '保险费用'
            }
          ]
        },
        {
          lnk: '/tradingcenter/orangebalance',
          text: '橙子数据',
          child: [
            {
              lnk: '/tradingcenter/orangebalance',
              text: '橙子余额'
            }, {
              lnk: '/tradingcenter/orangedetail',
              text: '橙子明细'
            }
          ]
        }

      ],
      SIGNS: {
        // '/riskoverview/risklist': '/riskoverview/riskdetail',
        // '/riskoverview/devicelist': '/riskoverview/riskdetail',
        // '/riskoverview/timeline': '/riskoverview/riskdetail',
        // '/riskoverview/riskinfo': '/riskoverview/riskdetail',

        // '/riskoverview/eventlist': '/riskoverview/eventdetail',
        // '/riskoverview/edevicelist': '/riskoverview/eventdetail',
        // '/riskoverview/etimeline': '/riskoverview/eventdetail',
        // '/riskoverview/eventinfo': '/riskoverview/eventdetail',
      },
      default_active: '/rechargerecord'
    }
  },
  watch: {
    '$route': function (val) {
      console.log(val,22222222)
      console.log(this.$router.currentRoute.path,1111111111111)
      this.default_active = this.SIGNS[this.$router.currentRoute.path] || this.$router.currentRoute.path
    }
  },
  mounted () {
    this.default_active = this.SIGNS[this.$router.currentRoute.path] || this.$router.currentRoute.path
  }
}
</script>

<style lang="scss">

</style>